@use 'mixin';

/**
* 字体位置
*/
.tac {
  text-align: center;
}

.tal {
  text-align: left;
}

.tar {
  text-align: right;
}

.vab {
  vertical-align: bottom;
}

.vat {
  vertical-align: top;
}

.vam {
  vertical-align: middle;
}

.fwb {
  font-weight: bold;
}

/**
* 字体颜色
*/
.c0 {
  color: #000;
}

.c3 {
  color: #333;
}

.c6 {
  color: #666;
}

.c9 {
  color: #999;
}

.cred {
  color: var(--hrhg-text-color-red);
}

.cgreen {
  color: var(--hrhg-text-color-green);
}

.cyellow {
  color: #ff9546;
}

.cblue {
  color: #1f87ff;
}

/**
* flex
*/
.flex {
  display: flex;

  .grow {
    flex: 1;
  }

  &.stretch {
    align-items: stretch;
  }

  &.as {
    align-items: flex-start;
  }

  &.ac {
    align-items: center;
  }

  &.ae {
    align-items: flex-end;
  }

  &.js {
    justify-content: flex-start;
  }

  &.jc {
    justify-content: center;
  }

  &.je {
    justify-content: flex-end;
  }

  &.jsb {
    justify-content: space-between;
  }

  &.jsa {
    justify-content: space-around;
  }

  &.fdc {
    flex-direction: column;
  }

  &.fw {
    flex-wrap: wrap;
  }
}

.fs0 {
  flex-shrink: 0;
}

.flex-b {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.flex-a {
  display: flex;
  align-items: center;
  justify-content: space-around;
}

.flex-e {
  display: flex;
  align-items: center;
  justify-content: space-evenly;
}

/*
* 文字处理
*/
.ellipsis {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

.ellipsis-l2 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 2;
  -webkit-line-clamp: 2;
  line-break: anywhere;
  -webkit-box-orient: vertical;
}

.ellipsis-l3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  line-clamp: 3;
  -webkit-line-clamp: 3;
  line-break: anywhere;
  -webkit-box-orient: vertical;
}

/**
* 线
*/
.bl-line {
  border-left: 1px solid var(--hrhg-base-line-border-color);
}

.br-line {
  border-right: 1px solid var(--hrhg-base-line-border-color);
}

.bb-line {
  border-bottom: 1px solid var(--hrhg-base-line-border-color);
}

.bt-line {
  border-top: 1px solid var(--hrhg-base-line-border-color);
}

/*
* 常用
*/
.hidden {
  overflow: hidden;
}

.relative-fill {
  @include mixin.relative-full;
}

.width-full{
  width: 100%;
}

//主题定制

$theme-primary: #1989fa; //主题色，应当与element-ui一致
$theme-danger: #f56c6c; //主题色，应当与element-ui一致
$theme-success: #35b881;
$theme-warning: #f78f5f;
$theme-aside-bgc: #f7f7f9;

$theme-desc-color: #a2a4a8; //辅助文字颜色
$theme-secondary: #909399; //

//节点宽度
$node-width: 220px;
//节点线长
$node-line-len: 80px;
$node-line-width: 2px;
//节点连线颜色
$node-line-color: #CACACA;
//流程图背景颜色
$main-bgc: #F5F6F6;

.w-node-err{
  border: 1px solid $theme-danger;
  box-shadow: 0 0 5px 0 $theme-danger !important;
}

